import { AppDetailContext } from "@/context/app/detail/appDetailContext";
import { Flex } from "@chakra-ui/react";
import React, { forwardRef } from "react";
import { ComponentRef, useContext, useRef } from "react";

const ChatTest = ({
    isOpen,
    nodes = [],
    edges = [],
    onClose
}:any)=>{
    const appDetail = useContext(AppDetailContext);

    // const ChatBoxRef = useRef<ComponentRef>(null);
    // const { userInfo } = useUserStore();

    return (
        <>
            <Flex
              zIndex={101}
              flexDirection={'column'}
              position={'absolute'}
              top={5}
              right={0}
              h={isOpen ? '95%' : '0'}
              w={isOpen ? ['100%', '460px'] : '0'}
              bg={'white'}
              boxShadow={'3px 0 20px rgba(0,0,0,0.2)'}
              borderRadius={'md'}
              overflow={'hidden'}
              transition={'.2s ease'}
            >
                 <Flex py={4} px={5} whiteSpace={'nowrap'}>
                     <span>Chat</span>
                     11111
                 </Flex>
            </Flex>
        </>
    )
}



export default React.memo(forwardRef(ChatTest));
